:root {
  --editor-bg: #2c2d2f;

  --editor-group-font-size: 16px;
  --editor-group-color: #ffffff;
  --editor-group-font-weight: 500;

  --editor-tooltip-height: 42px;
  --editor-tooltip-bg: #37383c;
  --editor-tooltip-shadow: 0 2px 20px -1px rgba(0, 0, 0, 0.85);

  --editor-guide-bg: #37383c;
  --editor-guide-shadow: 0 2px 20px -1px rgba(0, 0, 0, 0.85);

  --editor-header-height: 56px;
  --editor-header-bg: #37383c;
  --editor-header-z-index: 5;
  --editor-header-position: relative;
  --editor-header-line-color: #57585d;
  --editor-header-border: 0.5px solid rgba(125, 129, 137, 1);

  --editor-header-icon-size: 14px;
  --editor-header-icon-color: #d8d8d8;
  --editor-header-icon-padding: 4px;
  --editor-header-icon-radius: 6px;
  --editor-header-icon-active-bg: #26272a;

  --editor-header-zoom-slider-height: 4px;
  --editor-header-zoom-slider-bg: #4f5052;
  --editor-header-zoom-slider-handle-size: 10px;
  --editor-header-zoom-slider-handle-bg: #d5d5db;
  --editor-header-zoom-show-width: 84px;
  --editor-header-zoom-show-height: 28px;
  --editor-header-zoom-show-color: #dadada;
  --editor-header-zoom-show-border: 1px solid #979797;
  --editor-header-zoom-show-radius: 6px;

  --editor-panel-border: 0.5px solid rgba(151, 151, 151, 0.19);
  --editor-panel-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.28);
  --editor-panel-bg: #37383c;

  --editor-panel-width: 250px;
  --editor-panel-collapsed-width: 130px;
  --editor-panel-collapsed-trigger-color: #ffffff;
  --editor-panel-collapsed-trigger-border-top: 1px solid #7d8189;

  --editor-menu-bg: #37383c;
  --editor-menu-color: #cecfd2;
  // 菜单行高
  --editor-menu-node-height: 56px;

  // 菜单线条颜色
  --editor-menu-line-color: #57585d;
  // 菜单选中背景颜色
  --editor-menu-selected-color: #53555f;
  // 菜单组标题颜色
  --editor-menu-group-color: #d4d5d8;
  // 菜单组统计数字颜色
  --editor-menu-count-color: #999a9e;

  // 菜单组统计数字字号
  --editor-menu-count-font-size: 14px;

  // 多图模式菜单宽度
  --editor-menu-width-multi-graph: 232px;
  // 多图模式菜单外边距
  --editor-menu-margin-multi-graph: 24px;
  // 多图模式菜单圆角
  --editor-menu-radius-multi-graph: 8px;

  --editor-component-type-height: 32px;
  --editor-component-type-border: 1px solid #242527;
  --editor-component-type-radius: 4px;
  --editor-component-type-color: #d8d8d8;
  --editor-component-type-bg: #3c3d42;
  --editor-component-type-padding: 0 10px;
  --editor-component-type-text-align: center;

  --editor-component-type-color-checked: #ffffff;
  --editor-component-type-border-color-checked: #0171ef;
  --editor-component-type-bg-checked: #26272a;

  --editor-component-button: #37383c;
  --editor-component-button-size: 40px;
  --editor-component-button-radius: 4px;
  --editor-component-button-padding: 4px;

  --editor-component-button-checked: #26272a;
  --editor-component-button-font-size: 12px;
  --editor-component-button-text: #c3c4c5;
  --editor-component-button-text-checked: #0171ef;

  --editor-sider-bg: #37383c;
  --editor-sider-width: 280px;
  --editor-sider-border: 0.5px solid rgba(41, 42, 45, 1);
  --editor-sider-shadow: 0px 12px 6px 0px rgba(0, 0, 0, 0.28);

  --editor-tabs-nav-border-color: rgba(125, 129, 137, 0.38);
  --editor-tabs-nav-list-tabBar-gutter: 8px;
  --editor-tabs-tab-height: 32px;
  --editor-tabs-tab-margin: 15px 0;
  --editor-tabs-tab-padding: 0 24px;
  --editor-tabs-tab-background: #3c3d42;
  --editor-tabs-tab-border: 1px solid rgba(36, 37, 39, 1);
  --editor-tabs-tab-radius: 2px;
  --editor-tabs-tab-color: #d8d8d8;
  --editor-tabs-tab-background-active: #26272a;
  --editor-tabs-tab-border-active: 1px solid rgba(1, 113, 239, 1);
  --editor-tabs-tab-color-active: #fff;
}
